import React from 'react'
import {Menu , Icon} from 'antd'
import {Link} from 'dva/router'
import { browserHistory } from 'dva/router';

const getMenus = (arr)=>{
    return arr.map((item) => {
        if(item.children){
            return (
                <Menu.SubMenu 
                    key={item.key}
                    title={<span>{item.icon && <Icon type={item.icon} />}<span className="nav-text">{item.name}</span></span>}
                    >
                    {getMenus(item.children)}
                </Menu.SubMenu>    
            )
        }
        
        return (
            <Menu.Item key={item.key}>
                <Link to={item.path || '#'}>
                    {item.icon && <Icon type={item.icon} />}
                    <span className="nav-text">{item.name}</span>
                </Link>
            </Menu.Item>
        )
    })
}
const arr =[{
    key:"1",
    name:"ChartsMana",
    path:'/ChartsMana',
    icon:"mail"
  },{
    key:"2",
    name:'Editor',
    path:'/Editor',
    icon:"mail"
  },{
    key:"3",
    name:"demo1",
    path:'/Demo1',
    icon:"mail"
  },{
    key:"4",
    name:"Checkbox",
    path:'/Checkbox',
    icon:"mail"
  },{
    key:"5",
    name:"Upload",
    path:'/Upload',
    icon:"mail"
  },{
      children:[{
        key:"6",
          name:"demo4",
          path:"/demo4",
          icon:"mail"
      }],
      key:"22",
      name:'children',
      icon:"mail"
  }
  ]
class Menus extends React.Component {
    constructor(props){
        super(props)
    }
    state={
        selectedKey:""
    }
    componentDidMount(){
        console.log(window.location)
    }
    render(){
        return (
            <Menu theme="dark"
                mode="inline"
                
            >
                {getMenus(arr)}
            </Menu>
        )
    }
}

export default Menus 